<template>
    <div class="p-2">
        <el-row :gutter="20">
            <el-col :span="8" :xs="24" :lg="8" :md="12" :xl="8">
                <earlyWarning />
            </el-col>
            <el-col :span="8" :xs="24" :lg="8" :md="12" :xl="8">
                <productQuality />
            </el-col>
            <el-col :span="8" :xs="24" :lg="8" :md="24" :xl="8">
                <overdueSituation />
            </el-col>
        </el-row>

        <el-row class="mt20">
            <el-col :span="24" >
                <overviewTable />
            </el-col>
        </el-row>
    </div>
</template>
<script setup lang="ts">
import earlyWarning from './components/earlyWarning.vue'
import productQuality from './components/productQuality.vue'
import overdueSituation from './components/overdueSituation.vue'
import overviewTable from './components/overviewTable.vue'
</script>
<style lang="scss" scoped></style>